Alpha Anywhere 4.3 Videos
IN THIS PAGE
This is a list of vidoes published for Alpha Anywhere 4.3 through Alpha Anywhere 4.3.2.
Alpha Anywhere 4.3
Category | Title | Description |
---|---|---|
UX Component - FormView Control | Capturing Signatures using the SignatureInk Editor |
A common requirement when using the FormView control is capturing a signature. Alpha Anywhere has a Signature control, but
this control captures signatures as bitmaps and is not ideal for use in a FormView control. The Ink control
is better suited for this use case.
In this video we show how a FormView control is configured to use the built-in SignatureInk editor. Watch Video Download Component Date added: 2016-06-30 |
Node | Installing a Node Module from NPM and then Creating a Node Service to Call Methods in the Node Module |
The Xbasic code you write in your Web applications can call methods in Node.js modules that are installed from NPM (the Node
Package Manager).
In this video we show how a Node module is installed into the Web Project folder and then how a Node Service is created so that methods in the Node module can be called. The particular Node module that we install in this video is called Tinify and we show how a Node Service is defined so that we can call into this module from Xbasic using the Node_request() function. Watch Video - Part 1 Watch Video - Part 2 Watch Video - Part 3 Date added: 2016-07-06 |
UX Component - Ink Control | Customizing the Ink Control Overlay |
The Ink control 'overlay' displays a number of tools that are used by the Ink editor (such as the Pen selector, Eraser, etc.).
You can customize the appearance of the 'overlay' and add your own tools (i.e buttons).
In this video we show how you can add a new button to the Ink editor overlay. Watch Video Date added: 2016-07-08 |
UX Component - Ink Control | Setting the Ink Control Background Image |
Setting the background image in the Ink Control is a common practice. In this video we discuss various aspects of how you
can set the Ink control image background and control whether the UX goes dirty when the Ink background
is set.
Watch Video - Part 1 Watch Video - Part 2 Date added: 2016-07-06 |
UX Component - Ink Control | Using the Ink Control to Capture Signatures |
The UX Component has always had a built in Signature Capture control. However, it is also possible to use the Ink control
to capture signatures. The primary benefit of using the Ink control to capture signatures is that the
signature is captured using the Ink format, which is an ascii format, rather than as a PNG image, which
the Signature Capture control uses.
In this video we show how to configure the Ink control to capture signatures. Watch Video Date added: 2016-07-08 |
UX Component - ViewBox | Using a ViewBox as the List's Detail View |
A common pattern when building mobile applications is to use a List control with a Detail View. When the user taps on a row
in the List, the Detail View shows the details for the selected row. This pattern is used extensively,
especially for offline applications where the data in the List is intended to be updateable.
However, there are many cases where the List is not intended to be updateable and a much 'lighter weight' solution can be achieved but not turning on the List's 'Has Detail View property' and instead, using a ViewBox to display details for the selected row in the List. An even lighter weight solution can be achieved by using a ViewBox to replace the List. So you end up with a ViewBox to display a list of records and another ViewBox to display details for the selected record. Watch Video - Part 1 Watch Video - Part 2 Download Component Date added: 2016-07-09 |
UX Control | Building a Custom Image Gallery using the List and Ink Control |
The List and Ink Control can be used to build a custom Image Gallery in which the List is used to display thumbnails of the
available images and when the user taps on a particular image, the full size image is shown in the Ink
control. The advantage of using the Ink control to display the image is so that you can take advantage
of the Ink controls pinch-zoom features and pan features to scale the image and to pan around to see
details of different parts of the image. The ability to actually draw ink (which of course is the primary
purpose of the Ink control) is not used in this case.
Watch Video - Part 1 Watch Video - Part 2 Watch Video - Part 3 Download Component Date added: 2016-07-16 |
UX Component - List Control | Options for Handling Write Conflicts when Syncing Data |
When you build a disconnected mobile application, there is always a chance that the user will get a write conflict when they
sync data that was edited while they were offline. This could happen because some other user has
committed a change to a record before another user could commit their change.
By default, when a write conflict occurs, the information about the conflict is sent to the user and the user can resolve the conflict by selecting 'Their value' or 'My value'. However, there are other powerful programmatic options for handling write conflicts. In this video we discuss the various techniques for handling write conflicts. Watch Video - Part 1 Watch Video - Part 2 Date added: 2016-07-21 |
Grid Component | Preventing User from Closing Pop-up Window if Grid or a Linked Child Grid is Dirty |
It is common in web applications to have buttons that open a Grid component in a pop-up window. The Action Javascript builder
when you build this action has a built-in property that allows you to prevent the user from closing the
window if the Grid shown in the window is dirty. But what if the Grid shown in the window has Linked
child Grid components? You might want to also check that the child Grids are not dirty before the window
can be closed.
In this video we show how this can be done. Watch Video Date added: 2016-08-04 |
UX Component - FormView Control | Creating Complex Form Layouts using the Flow and Column Layout Containers |
When you lay out a Form using the FormView control, by default, the controls on the form are rendered with one control per
line and each control taking up the full width of the FormView control. If you want to create a more
complex Layout you can either switch from Genie mode to the Freeform mode, or you can use Flow and Column
Layout Containers to control the layout of your Form.
In this video we show how a complex Form layout is achieved using Column and Flow layout containers. Watch Video - Part 1 Watch Video - Part 2 Download Component Date added: 2016-08-27 |
UX Component | Adjusting Colors and Fonts in a Stylesheet |
Alpha Anywhere has always allowed you to edit a stylesheet used by a component to change any of the CSS defined in the stylesheet.
But when you simply want to change some colors in a stylesheet, using the style editor may be more than
you need.
In this video we show how you can easily adjust colors and fonts in a style. NOTE: This option is only available for 'new' styles (AndroidLight, AndroidDark, iOS7, Alpha) as these styles are based on SASS. Watch Video Date added: 2016-09-14 |
UX Component - ControlBar Control | Introduction to Basic Concepts |
This video demonstrates basic concepts of the ControlBar control.
Watch Video - Part 1 Watch Video - Part 2 Date added: 2016-09-14 |
UX Component - ControlBar Control | Updating ControlBar Data - Dynamic Text |
This video demonstrates how you can update the data in the ControlBar's data. This allows you to put dynamic text in the
Controlbar. We also show how the ControlBar can be animated when it is refreshed.
Watch Video - Part 1 Watch Video - Part 2 Date added: 2016-09-14 |
UX Component - ControlBar Control | Using Watch Events to Update ControlBar Data |
The ControlBar data can be updated automatically in response to certain events in the UX (such as the UX going dirty, a List
going dirty, etc.) or by a change in the value of one or more controls.
In this video we show how you can configure watch events to automatically update ControlBar data. Watch Video Date added: 2016-09-14 |
UX Component - ControlBarControl | Adding a Button to a ControlBar |
In this video we show how you can add a button to a ControlBar and then associate an action (i.e. some Javascript code) to
run when the button is tapped.
Watch Video Download Component Date added: 2016-09-14 |
UX Component - ControlBarControl | Adding a Button-Toggle to a ControlBar |
In this video we show how you can add a Button-Toggle to a ControlBar. Toggle buttons can either be two-state (switching
between a true and a false state), or multi-state (each click advances to the next button state).
The video shows how the state of a Button-Toggle is used to control what action a button performs when clicked. Watch Video Download Component Date added: 2016-09-14 |
UX Component - ControlBarControl | Adding a Button-List to a ControlBar |
A common pattern in mobile apps is to have a button bar at the bottom of the screen with a series of buttons that allow you
to select the active Panel that is shown on the device. Typically, these buttons are spread out so that
they fill the width of the screen.
The button-list control is ideal for implementing this pattern. In this video we show how a Button-List can be configured to fill the width of the screen and to select a Panel Card in a Panel Layout when one of the buttons in the Button-List is tapped. Watch Video - Part 1 Watch Video - Part 2 Watch Video - Part 3 Download Component Date added: 2016-09-14 |
UX Component - ControlBar Control | Selecting the Active ControlBar Layout |
A ControlBar can have multiple Layouts. In this video we show how you can dynamically select the Layout to show.
Watch Video - Part 1 Watch Video - Part 2 Download Component Date added: 2016-09-14 |
UX Component - ControlBar Control | Showing a Disclosure |
A disclosure can be some explicitly defined HTML, or it can be another Layout. In this video we show how a disclosure, defined
as a ControlBar layout, is shown.
Watch Video Download Component Addendum: One of the more unusual disclosure types is Outside-After (and Outside-Before) which display the disclosure perpendicular to the parent Layout. In this video we show how the disclosure is rendered when the Outside-After type is selected. Watch Video - Part 2 Date added: 2016-09-14 |
UX Component - ControlBar Control | Showing a List in a Disclosure |
You can display standard UX controls (such as Lists, Buttons, Input controls, etc.) in a disclosure. In this video we show
how a list is displayed in a disclosure.
Watch Video - Part 1 Watch Video - Part 2 Download Component Date added: 2016-09-16 |
UX Component - ControlBar Control | Setting the Selected Button in a Button List using Javascript |
The selected button(s) in a ControlBar Button List can be set programmatically using Javascript. It is also possible to completely
change the buttons shown in a Button List programmatically.
In this video we show how this is done. Watch Video Download Component Date added: 2016-09-21 |
UX Component | Google Address Auto-complete |
A commonly seen feature in many web and mobile applications is address auto-complete. As the user starts typing an address
into a textbox, a list of suggested address is shown and the user can select from the list. This feature
is powered by Google Maps.
In this video we show how you can turn on the Address Suggest feature for any textbox control on a UX. NOTE: Textbox controls in Repeating Sections are not supported. Watch Video - Part 1 Watch Video - Part 2 Date added: 2016-09-16 |
UX Component - ControlBar Control | Defining Javascript in a ControlBar - Understanding the 'This Object' Option. Using Javascript function in a template. |
When you define Javascript functions in a ControlBar (and also a ViewBox and FormView control), you can specify where the
Javascript should be stored. The options are: At the control level, at the UX level and 'This object'.
This video explains the options and discusses why the 'This object' option is best. It also describes how functions defined at the 'This object' level can be referenced in templates. Watch Video Download Component Date added: 2016-09-28 |
UX Component - ControlBar Control | Dynamically Showing and Hiding Lines in a ControlBar Layout |
A ControlBar layout can have multiple Lines. Each Line in a Layout can be dynamically shown or hidden.
This video shows how a show expression can be defined for a Line in a ControlBar Layout Watch Video Download Component Date added: 2016-09-28 |
UX and Grid Component | Sending SMS Messages using the Twilio Service |
You can send SMS messages from the Grid and the UX. The messages are sent using the Twilio service, so you will need a Twilio
account. You can use Action Javascript to define the action which sends the message.
There are a large number of options for customizing the message, such as sending messages in different languages, depending on the user preference. In this video we show how a button was defined in the UX to send a message. The phone number and message body are read from controls on the UX. Watch Video Date added: 2016-09-29 |
UX Component | Creating Offline HTML5 Applications using the Application Cache |
The Application Cache (an HTML5 feature widely supported by various browsers) allows you to build 'offline' applications
- i.e. applications that can be loaded into the browser even if there is no internet connection.
In order to load the application initially an internet connection is obviously needed. But once the application
has been loaded initially, all of the files (e.g. CSS.Javascript, images, etc.) referenced by the
application are cached in the browser and an internet connection is not needed to load the application
subsequently.
If the application is updated, then if an internet connection is available when the app is loaded, the new version of the app is downloaded and cached in the browser. In this video we show how offline HTML5 applications can be created using the Application Cache feature. NOTE: These 'offline' HTML5 applications do not require PhoneGap! Watch Video - Part 1 Watch Video - Part 2 Date added: 2016-09-29 |
UX Component - List Control | Saving and Restoring List Settings to Quickly Define New Lists |
The List control is one of the most commonly used controls in a UX component. But because of the richness of the List, there
can be many properties that need to be set to configure a List. After you have configured a List, you
can save all of the settings for the List in a named file. Then when you define your next List, you can
restore the settings from the named file - saving a lot of time.
This video demonstrates how List settings can be saved and restored. Watch Video Date added: 2016-109-02 |
UX and Grid Component | Using the Javascript Code Library |
The Javascript Code Library is available in all contexts where Javascript can be edited. The Code Library is ideal for storing
snippets of code that can then be pasted into the Javascript you are editing.
In this video we walk through the various features of the Javascript Code Library. Watch Video Date added: 2016-109-05 |
UX Component - ControlBar Control | Adding an Edit ControlBar Item to a ControlBar |
A ControlBar typically contains text and buttons, but a common use case is to build a Search ControlBar that uses an edit
control in the ControlBar.
In this video we show how the edit ControlBar item type can be used to build a Search feature. Watch Video Download Component Date added: 2016-10-08 |
UX Component - ControlBar Control | Displaying a Modal Pop-up Form using a Disclosure |
A common pattern in many applications (both Mobile and Desktop web) is to display pop-up modal forms to collect some information
from the user. Displaying pop-up modal forms using the ControlBar is very easy and extremely powerful.
This video shows how a ControlBar 'disclosure' is used to display a pop-up modal form. The 'a5-action' attribute in the Disclosure HTML is used to invoke actions defined in the ControlBar's Action pane. Watch Video - Part 1 Watch Video - Part 2 Download Component Date added: 2016-10-08 |
UX Component - FormView Control | Displaying Calculated Values on a FormView Control |
When you design a FormView control you may want the form to display calculated values (typically computed from other fields
in the form). Since the Form is really just an HTML template that is rendered using Alpha Anywhere's
client-side templating features, this is easily done.
In this video we show how a calculated field is added to the FormView control. Watch Video Download Component Date added: 2016-10-10 |
Alpha Anywhere 4.3.1
Category | Title | Description |
---|---|---|
UX Component - Ink Control | Image Annotation using the Ink Control in a Data Bound UX Component |
The ink control allows you to create sketches by 'drawing' with your mouse, any type of pointing device, or with your finger
(on a device that supports touch). A common use of the ink control is to annotate images. The image you
want to annotate is shown as the background to the ink control and then you can draw 'on top of' the
image. When the data are saved the ink is stored separately from the image in a long text field.
In this video we show how a data bound UX component that allows a user to upload images can be configured to allow the user to annotate the images that are uploaded. Watch Video - Part 1 Watch Video - Part 2 Watch Video - Part 3 Watch Video - Part 4 Download Component Download SQL Table Definition Date added: 2016-10-30 |
UX Component - ControlBar Control | Defining Disclosure Forms using the Disclosure Form Builder |
In the video 'Displaying a Modal Pop-up Form using a Disclosure' we show how a modal pop-up form can be displayed using a
Disclosure. The definition of the HTML for the form is fairly tedious because it is completely hand coded.
In this video we show how the Disclosure Form Builder can be used to make it easier to define the form HTML. Watch Video - Part 1 Watch Video - Part 2 Download Component Date added: 2016-10-30 |
UX Component ControlBar Control | Display Modal Message Dialogs using Disclosures |
Modal messages (such as confirmations, progress, feedback) as commonly used when designing the user interface for an application.
ControlBar disclosures make displaying these messages particularly easy.
In this video we show how the ControlBar can be configured to display three different types of message dialogs: basic information dialogs (one button), confirmation dialogs (two buttons) and wait dialogs (no buttons). Watch Video - Part 1 Watch Video - Part 2 Watch Video - Part 3 Download Component Date added: 2016-10-30 |
UX Component - List Control | Specifying Sort Criteria when Filtering a List |
Action Javascript allows you to easily define fields on a UX where the user can specify search criteria for a List control
on the UX ( much like the Search Part in a Grid). Now you can also define sort criteria.
In this video we show how the Filter Records in a List action in Action Javascript can be configured to allow sort criteria to be specified. Watch Video Download Component Date added: 2016-1-03 |
UX Component - ControlBar Control | Adding List Navigation Buttons to a ControlBar |
When you define a List control, you can specify that the List should be paginated. If you set the pagination method to 'Navigation
Buttons' then you must define buttons to move to the next and previous page of records. In a mobile application
that uses a ControlBar in a Panel header or footer, it is desirable to place these navigation buttons
in the ControlBar.
In this video we show how you can quickly add List navigation buttons to a ControlBar by selecting the 'Pre-defined buttons' option when adding ControlBar items to your ControlBar definition. Watch Video Date added: 2016-11-05 |
UX Component - FormView Control | Using a FormView Control to Edit Data in a List Control - Master-Detail Forms - Very Large Forms |
By default, when you configure a List with a Detail View (so that edits can be made to the List data), the Detail View is
composed using individual controls (e.g. Textbox, Textarea, Dropdown, etc). If the Detail View has a
large number of fields, then composing the Detail View using individual controls will be inefficient
and will result is a very large UX component that may not perform well.
An alternative approach is to use the FormView control to implement the List's Detail View. This is extremely efficient and will allow you to build UX components that edit very large forms but still perform very well. In this video we show how a master-detail Form is built using a FormView control to edit the fields in the Master table and a second FormView control to edit the fields in the Detail Table. The master table has 100 fields and the detail table has 100 fields, so in total, the UX component is editing 200 fields. Watch Video - Part 1 Watch Video - Part 2 Watch Video - Part 3 Watch Video - Part 4 Download Component Download Script to Create SQL Tables Date added: 2016-11-08 |
UX Component - FormView Control | Tutorial - Building a Mobile Master-Detail Form using The List, FormView and ControlBar Controls - |
In this video tutorial we show how a mobile app can be built to implement a master-detail form using the FormView control.
The app will allow users to edit data from the Customers and Orders table in the sample Northwind database.
This is a classic master-detail form: Each customer has multiple orders. The UX component uses two Lists
joined in a parent-child relationship. The parent List displays data from the Customer table and the
child List display the related orders from the Orders table.
Each List has a Detail View, but in both cases, the Detail View is implemented using the FormView control. Once the basic functionality of the app has been built, the app is 'mobilized' by wrapping the various sections of the component in PanelCards and a ControlBar is added to implement navigation between the various parts of the application. Watch Video - Part 1 Watch Video - Part 2 Watch Video - Part 3 Watch Video - Part 4 Watch Video - Part 5 Watch Video - Part 6 Watch Video - Part 7 Watch Video - Part 8 Watch Video - Part 9 Watch Video - Part 10 Download Components Date added: 2016-11-10 |
Alpha Anywhere 4.3.2
Category | Title | Description |
---|---|---|
UX Component - Ink Control | Image Annotation using the Ink Control in a Data Bound UX Component |
The ink control allows you to create sketches by 'drawing' with your mouse, any type of pointing device, or with your finger
(on a device that supports touch). A common use of the ink control is to annotate images. The image you
want to annotate is shown as the background to the ink control and then you can draw 'on top of' the
image. When the data are saved the ink is stored separately from the image in a long text field.
In this video we show how a data bound UX component that allows a user to upload images can be configured to allow the user to annotate the images that are uploaded. Watch Video - Part 1 Watch Video - Part 2 Watch Video - Part 3 Watch Video - Part 4 Download Component Download SQL Table Definition Date added: 2016-10-30 |
UX Component - ControlBar Control | Defining Disclosure Forms using the Disclosure Form Builder |
In the video 'Displaying a Modal Pop-up Form using a Disclosure' we show how a modal pop-up form can be displayed using a
Disclosure. The definition of the HTML for the form is fairly tedious because it is completely hand coded.
In this video we show how the Disclosure Form Builder can be used to make it easier to define the form HTML. Watch Video - Part 1 Watch Video - Part 2 Download Component Date added: 2016-10-30 |
UX Component ControlBar Control | Display Modal Message Dialogs using Disclosures |
Modal messages (such as confirmations, progress, feedback) as commonly used when designing the user interface for an application.
ControlBar disclosures make displaying these messages particularly easy.
In this video we show how the ControlBar can be configured to display three different types of message dialogs: basic information dialogs (one button), confirmation dialogs (two buttons) and wait dialogs (no buttons). Watch Video - Part 1 Watch Video - Part 2 Watch Video - Part 3 Download Component Date added: 2016-10-30 |
UX Component - List Control | Specifying Sort Criteria when Filtering a List |
Action Javascript allows you to easily define fields on a UX where the user can specify search criteria for a List control
on the UX ( much like the Search Part in a Grid). Now you can also define sort criteria.
In this video we show how the Filter Records in a List action in Action Javascript can be configured to allow sort criteria to be specified. Watch Video Download Component Date added: 2016-1-03 |
UX Component - ControlBar Control | Adding List Navigation Buttons to a ControlBar |
When you define a List control, you can specify that the List should be paginated. If you set the pagination method to 'Navigation
Buttons' then you must define buttons to move to the next and previous page of records. In a mobile application
that uses a ControlBar in a Panel header or footer, it is desirable to place these navigation buttons
in the ControlBar.
In this video we show how you can quickly add List navigation buttons to a ControlBar by selecting the 'Pre-defined buttons' option when adding ControlBar items to your ControlBar definition. Watch Video Date added: 2016-11-05 |
UX Component - FormView Control | Using a FormView Control to Edit Data in a List Control - Master-Detail Forms - Very Large Forms |
By default, when you configure a List with a Detail View (so that edits can be made to the List data), the Detail View is
composed using individual controls (e.g. Textbox, Textarea, Dropdown, etc). If the Detail View has a
large number of fields, then composing the Detail View using individual controls will be inefficient
and will result is a very large UX component that may not perform well.
An alternative approach is to use the FormView control to implement the List's Detail View. This is extremely efficient and will allow you to build UX components that edit very large forms but still perform very well. In this video we show how a master-detail Form is built using a FormView control to edit the fields in the Master table and a second FormView control to edit the fields in the Detail Table. The master table has 100 fields and the detail table has 100 fields, so in total, the UX component is editing 200 fields. Watch Video - Part 1 Watch Video - Part 2 Watch Video - Part 3 Watch Video - Part 4 Download Component Download Script to Create SQL Tables Date added: 2016-11-08 |
UX Component - FormView Control | Tutorial - Building a Mobile Master-Detail Form using The List, FormView and ControlBar Controls - |
In this video tutorial we show how a mobile app can be built to implement a master-detail form using the FormView control.
The app will allow users to edit data from the Customers and Orders table in the sample Northwind database.
This is a classic master-detail form: Each customer has multiple orders. The UX component uses two Lists
joined in a parent-child relationship. The parent List displays data from the Customer table and the
child List display the related orders from the Orders table.
Each List has a Detail View, but in both cases, the Detail View is implemented using the FormView control. Once the basic functionality of the app has been built, the app is 'mobilized' by wrapping the various sections of the component in PanelCards and a ControlBar is added to implement navigation between the various parts of the application. Watch Video - Part 1 Watch Video - Part 2 Watch Video - Part 3 Watch Video - Part 4 Watch Video - Part 5 Watch Video - Part 6 Watch Video - Part 7 Watch Video - Part 8 Watch Video - Part 9 Watch Video - Part 10 Download Components Date added: 2016-11-10 |
UX Component | Displaying a Custom Wait Message while a Large Mobile App is Loading in the Background |
If you have built a very large mobile App which takes some time to load, you might want to display a custom wait message
to the user while the main UX component of your App is loaded in the background.
In this video we show how this can be done using a simple 'startup' UX component. Watch Video Download Components Date added: 2016-12-11 |
UX Component - PhoneGap | PhoneGap - Using the PhoneGap - Open File with Native Application Action to View PDF Files in a Mobile Application |
The PhoneGap cordova-open plugin allows you to open various file types using the associated native app on a mobile device.
For example, if you open a .pdf file, the PDF file is displayed using the native PDF viewer app on the
mobile device. If you open a .mp4 file, the video is displayed using the native video viewer on the device.
A common use case for this plugin is to download several files when a connection is available so that
the files can then be viewer later on when no connection is available.
In this video we show how an application is built that shows a list of PDF files. These files are downloaded from the server and stored in the filesystem on a mobile device. Then we show how each of the downloaded files can be viewed using the PDF viewer on the mobile device. Because the PDF files are stored in the filesystem on the device, they can be viewed even if the device no longer has a connection. The application uses the 'PhoneGap - Open File with Native Application' action to display the .pdf file. Watch Video - Part 1 Watch Video - Part 2 Watch Video - Part 3 Date added: 2016-12-27 |
UX Component - PhoneGap | PhoneGap- Viewing Reports in PDF Format on a Mobile Device |
The PhoneGap cordova-open plugin allows you to open files (such as .pdf files) using the natvie application associated with
that file type on a mobile device. This plugin is particularly useful for viewing PDF files. The Alpha
Anywhere report writer can save reports as PDF files. The cordova-open plugin therefore fits really well
with the Alpha Anywhere report writer because you can build applications that generate reports as PDF
files and then display the reports on a mobile device using the cordova-open plugin.
In this video we show how you can use Action Javascript (the 'PhoneGap - Open File with Native Application' action) to generate a PDF file from an Alpha Anywhere report, then download the resulting PDF file to a mobile device and display it using the native PDF viewer. Watch Video - Part 1 Watch Video - Part 2 Date added: 2016-12-27 |